
<template>
    <div>
        <!-- 基本信息弹窗 -->
        <Modal
            v-model="comparatRecordModal"
            width="1500px"
            styles='text-align:center'
            :closable="false"
            :mask-closable="false"
            footer-hide>
            <div class="container">
                <h2 class="tit">变更复审信息申请信息</h2>
                <Form ref="formValidate" :model="formValidate" :rules="ruleValidate">
                    <div class="left-part">
                        <div class="title">{{title}}</div>
                        <Row style="padding: 0 20px" :gutter='16'>
                            <Col span="8"> 
                                <div class="word">
                                    <span>申请机构：{{info.hospitalName}}</span>
                                </div> 
                            </Col>
                            <Col span="8"> 
                                <div class="word">
                                    <span>申请人：{{info.applicant}}</span>
                                </div> 
                            </Col>
                            <Col span="8"> 
                                <div class="word">
                                    <span>申请时间：{{info.applicantTime}}</span>
                                </div> 
                            </Col>
                            <Col span="23"> 
                                <div class="word" style="color:red">
                                    <span><span style="color:red;">*</span>变更原因说明：{{info.reasonChange}}</span>
                                </div> 
                            </Col>
                            <Col span="23"> 
                                <Row :gutter='64'>
                                    <Col span="12">
                                        <div class="contentbox">
                                            <p class="ptit">变更前信息</p>
                                            <div v-for="(item,index) in chargeList" :key="index" class="con">
                                                <p>
                                                    <span>{{index+1}}.</span>
                                                    <span>{{item.fieldName}}:</span>
                                                    <span>{{item.originalData}}</span>
                                                </p>
                                            </div>
                                        </div> 
                                    </Col>
                                    <Col span="12">
                                        <div class="contentbox">
                                            <p class="ptit">变更后信息</p>
                                            <div v-for="(item,index) in chargeList" :key="index" class="con">
                                                <p>
                                                    <span>{{index+1}}.</span>
                                                    <span>{{item.fieldName}}:</span>
                                                    <span class="s3">{{item.newData}}</span>
                                                </p>
                                            </div> 
                                        </div> 
                                    </Col>                                
                                </Row>
                            </Col>
                            <Col span="23">
                                <h2>复审意见
                                    <span class="ss" v-if='reviewStatus !=1'>({{info.reviewName}})</span>
                                </h2>
                                <p v-if='reviewStatus !=1'>{{info.reviewComments}}</p>
                                <div class="word">
                                    <Input
                                        v-if="reviewStatus ==1"
                                        v-model="formValidate.reviewComments"
                                        type="textarea"
                                        :autosize="{minRows: 5,maxRows: 10}"
                                        placeholder="请输入审核具体意见"
                                    ></Input>
                                </div>
                            </Col>
                           <Col span="8" v-if='reviewStatus !=1'> 
                                <div class="word">
                                    <span>审批机构：{{info.auditOrgName}}</span>
                                </div> 
                            </Col>
                            <Col span="8" v-if='reviewStatus !=1'> 
                                <div class="word">
                                    <span>审批人：{{info.reviewerName}}</span>
                                </div> 
                            </Col>
                            <Col span="8" v-if='reviewStatus !=1'> 
                                <div class="word">
                                    <span>审批时间：{{info.reviewTime}}</span>
                                </div> 
                            </Col>
                        </Row>
                    </div>
                </Form>
            </div>
            <div class="btn">
                <Button type="error" v-if="reviewStatus ==1" @click="handleSubmit(3)" :disabled="disabled">
                    <i class = "iconfont icon-butongyi" style="font-size:14px;margin-right:5px"></i>
                    驳回申请
                </Button>
                <!-- reviewStatus ==1 && businessType ==8 || businessType == 7 -->
                <Button type="primary" @click="handleSubmit(2)" style="margin-left:30px" v-if="reviewStatus ==1" >
                    <i class = "iconfont icon-bianji" style="font-size:14px;margin-right:5px"></i>审核通过
                </Button>
                <Button @click="comparatRecordModal = false" style="margin-left:30px">
                    <i class = "iconfont icon-butongyi" style="font-size:14px;margin-right:5px"></i>关闭返回
                </Button>
            </div>
        </Modal>
        <!-- 审核弹窗 -->
        <Modal
            v-model="showModal"
            title="审核弹窗"
            class="drugmanagement-commondrug-list-delModal">
            <p>确认{{tishi}}此次申请吗？</p>
            <div slot="footer" class="btn">
                <Button  @click="showModal = false">取消</Button>
                <Button type="primary" :loading="delLoading" @click="handleOk('formValidate')" :disabled='okdisabled'>确认</Button>
            </div>
        </Modal>
    </div>
</template>
<script>
import api from "@/api/commonApi";
export default {
    props: {
		comparatRecordModal: String,
		businessType: Number,
		reviewStatus: Number,
        id: Number,
	},
    data() {
        return {
            formValidate: {
				id: null,
				reasonChange: "",              //变更原因
                reviewComments: '',
			},
			ruleValidate: {
				// 单位法人姓名
				reasonChange: [ { required: true, message: "请输入变更原因", trigger: "change" } ],
			},
            notReview: true,
            hospitalId: '',  
            info: {},  
            chargeList: [],  
            title: '',  
            showModal: false, 
            tishi: '通过', 
            okdisabled: false, 
            reviewStatus: '',
        }
    },
    computed: {
		notReview() {
		    return this.mode !== 'review';
		},
	},
    mounted() {
        //获取对比详情
       this.getRecordInfo()
    },
    created() {
        if(this.businessType ==0) {
            this.title = '机构基本信息变更记录'
        } else if(this.businessType ==1) {
            this.title = '资质证明材料上传变更记录'
        } else if(this.businessType ==2) {
            this.title = '拟开展互联网医疗服务变更记录'
        } else if(this.businessType ==3) {
            this.title = '拟开展的临床科室变更记录'
        } else if(this.businessType ==4) {
            this.title = '平台相关协议变更记录'
        } else if(this.businessType ==5) {
            this.title = '互联网医院设立情况变更记录'
        } else if(this.businessType ==6) {
            this.title = '第三方合作模式变更记录'
        } else if(this.businessType ==7) {
            this.title = '拟派医护人员信息变更记录'
        } else if(this.businessType ==8) {
            this.title = '收费标准变更记录'
        }
    },
    methods: {
        //获取对比详情
        getRecordInfo() {	
			this.$axios.post(api.findeSuperviseReviewInfo, {id: this.id}).then(resp => {
				let ret = resp.data.object
				this.info = ret.applicant;
                this.chargeList = ret.info
                if(this.info.reviewStatus == 0){
                    this.info.reviewName = '新建'
                } else if(this.info.reviewStatus == 1) {
                    this.info.reviewName = '待审核'
                } else if(this.info.reviewStatus == 2) {
                    this.info.reviewName = '审核通过'
                } else if(this.info.reviewStatus == 3) {
                    this.info.reviewName = '驳回'
                }

                console.log('详情展示',ret)
			}).catch(err => {
				console.log(err);
			});
		}, 
        handleSubmit(val) {
            this.showModal = true
            this.reviewStatus = val
            if(val ==3) {
                this.tishi = '驳回'
            }
        },      
        // 提交表单
		handleOk(name,val) {	    
			this.okdisabled = true
			// this.$refs[name].validate(valid => {
			// 	if (valid) {
                    this.formValidate.reviewStatus = this.reviewStatus
                    this.formValidate.businessType = this.businessType
                    this.formValidate.id = this.id
					this.$axios
					.post(api.updateSuperviseApplicant, this.formValidate)
					.then(res => {
						if (res.data.code) {
							let ret = res.data;
                            this.$Message.info("操作成功");
							this.okdisabled = false 
                            this.showModal = false
							this.comparatRecordModal = false
                            this.$emit('getSuperviseData');
						} else {
							this.okdisabled = false 
							this.$Message.error(res.data.message);
						}
					})
					.catch(err => {
						this.okdisabled = false
						this.$Message.error(res.data.err);
					});
				// } else {
				// 	this.okdisabled = false 
				// 	// 必填项填写失败
				// 	this.$Message.error("请检查必填项是否填写正确！");
				// }
		// 	});
		},
    },
}
</script>
<style lang="less" scoped>
.tit {
    text-align: center;
    font-weight: 550;
}
.container {
    width: 100%;
    margin-bottom: 20px;
    background: #ffffff;
    display: flex;
    flex-direction: column;
      .left-part {
        width: 98%;
        margin: 20px auto;
        margin-left: 1%;
        margin-bottom: 20px;
        border: 1px solid #f0f0f0;
        box-shadow: 0 4px 3px #ebedf8;
        border-radius: 5px;
        .title {
            font-size: 20px;
            padding-left: 15px;
            margin-bottom: 20px;
            color: #333;
            height: 40px;
            line-height: 40px;
            background: #ebedf8;         
        } 
        .hongdian{
            margin-left: 25px;
        }
        .margin-up-down {
            display: inline-block;
            margin: 0px 10px 20px 20px;
        }
        .word {
            font-size: 16px;
            margin-bottom: 20px;
        }
        .ss {
            color:#ff9966;
            margin-left:20px;
            font-size: 14px;
        }
        h2{
            margin-bottom: 20px;
        }
        .contentbox {
            border: 1px solid #666;
            border-radius: 10px;
            margin-bottom: 20px;
            .ptit {
                font-weight: 550;
                font-size: 16px;
                text-align: center;
                border-bottom: 1px solid #666;
                height: 50px;
                line-height: 50px;
            }
            .con {
                padding: 0 10px;
                p{
                    margin: 15px 0;
                    span {
                        margin-right: 5px;
                    }
                }
                .s3 {
                    color: #fc6c49;
                }
            }
        }
    }
}
.btn {
    width:100%;
    text-align:center;
    margin-bottom: 20px;
}
</style>
